<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
  <meta charset="utf-8">
  <meta name="description" content="大学生就业实训,品质就业,职业规划,IT行业人才基地" />
  <title>蜗牛书城(woniuxy.com)-正品低价、品质保障、配送及时、轻松购物！</title>

  <!-- 引入Bootstrap核心样式文件 -->
  <link th:href="@{/asserts/bootstrap-3.4.1/css/bootstrap.min.css}" rel="stylesheet">
  <!-- 引入jQuery核心js文件 -->
  <script th:src="@{/asserts/javascript/jQuery-1.12.4.js}"></script>
  <!-- 引入BootStrap核心js文件 -->
  <script th:src="@{/asserts/bootstrap-3.4.1/js/bootstrap.min.js}"></script>


  <link rel="shortcut icon" th:href="@{/favicon.ico}" type="image/x-icon" />

  <link th:href="@{/asserts/css/common.css}" rel="stylesheet" />
  <link th:href="@{/asserts/css/top.css}" rel="stylesheet" />
  <link th:href="@{/asserts/css/foot.css}" rel="stylesheet" />

  <link th:href="@{/asserts/css/index.css}" rel="stylesheet" />

</head>
<body>
<!--  最顶部的导航栏 -->
<div th:replace="~{commons/tag::topNav}"></div>
<!--顶部导航结束-->

<!--  =================== head =============================== -->
<div th:replace="~{commons/tag::headerNav}"></div>
<!--头部结束-->


<div class="cate-menu container no-padding clear">
  <!--	<ul class="fl">
          <li><a href="#">程序设计</a></li>
          <li><a href="#">数据库</a></li>
          <li><a href="#">网络与数据通信</a></li>
          <li><a href="#">科普读物</a></li>
          <li><a href="#">建筑学</a></li>
      </ul>-->
  <!-- bootstrap轮播图 -->
  <div id="carousel-example-generic" class="carousel slide fl" data-ride="carousel">
    <!-- Indicators -->
    <ol class="carousel-indicators">
      <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
      <li data-target="#carousel-example-generic" data-slide-to="1"></li>
    </ol>

    <!-- Wrapper for slides -->
    <div class="carousel-inner" role="listbox">
      <div th:class="${b.id==1?'item active':'item'}"  th:each="b : ${bannerList}">
        <img th:src="|http://localhost:10001/${b.imagePath}|" alt="...">
      </div>
    </div>

    <!-- Controls -->
    <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
      <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
      <span class="sr-only">Previous</span>
    </a>
    <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
      <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
      <span class="sr-only">Next</span>
    </a>
  </div>
</div>

<!-- 中间的广告 -->
<!--<div class="container no-padding mt15">
    <div class="f clear">
        <div class="ad-box fl">
            <div class="left fl">
                <p><a href="#">古典小说系列</a></p>
                <p><a href="#">九折优惠</a></p>
            </div>
            <div class="right fl">
                <a href="#">
                    <img src="img/ad1.jpeg" />
                </a>
            </div>
        </div>

        <div class="ad-box fl">
            <div class="left fl">
                <p><a href="#">古典小说系列</a></p>
                <p><a href="#">九折优惠</a></p>
            </div>
            <div class="right fl">
                <a href="#">
                    <img src="img/ad2.jpeg" />
                </a>
            </div>
        </div>

        <div class="ad-box fl">
            <div class="left fl">
                <p><a href="#">古典小说系列</a></p>
                <p><a href="#">九折优惠</a></p>
            </div>
            <div class="right fl">
                <a href="#">
                    <img src="img/ad3.jpeg" />
                </a>
            </div>
        </div>

    </div>
</div>
-->
<!-- 好书热卖  -->
<div class="container no-padding mt15">
  <h4>图书展示</h4>
  <div class="book-box">
    <div class="book-right">
      <ul>
        <li th:each="h : ${pageInfo.list}">
          <a th:href="@{/book/searchDetail(id=${h.id})}">
            <img th:src="|http://localhost:10001/${h.imgsrc}|" alt="">
            <p class="book-name" th:text="${h.name}">java核心技术</p>
            <p class="book-price">￥<span th:text="${h.price}"></span></p>
          </a>
        </li>
      </ul>
    </div>
  </div>
</div>
<div style="text-align: center;font-size: 20px">
  当前 <span style="color: red" th:text="${pageInfo.pageNum}"></span>/<span th:text="${pageInfo.pages}"></span>页  &nbsp;
  <a class="btn btn-primary" th:href="@{/book/showBook(id=${typeId},now=1,size=${pageInfo.pageSize},bname=${bname})}">首页</a> &nbsp;
  <a class="btn btn-primary" th:href="@{/book/showBook(id=${typeId},now=${pageInfo.prePage},size=${pageInfo.pageSize},bname=${bname})}">上一页</a>&nbsp;
  <a class="btn btn-primary" th:href="@{/book/showBook(id=${typeId},now=${pageInfo.nextPage},size=${pageInfo.pageSize},bname=${bname})}">下一页</a>&nbsp;
  <a class="btn btn-primary" th:href="@{/book/showBook(id=${typeId},now=${pageInfo.pages},size=${pageInfo.pageSize},bname=${bname})}">尾页</a>
</div>
<!-- =============== 最后的网站底部 =============== -->
<div th:replace="~{commons/tag::footer}"></div>
</body>


</html>
